// pages/category/category.js
Page({

  /**
   * 页面的初始数据
   */
  data: {
    leftData: [],
    rightData: [],
    cateIndex: 0,
    scrollTop: 0
  },
  cates: [],

  /**
   * 生命周期函数--监听页面加载
   */
  // 进入页面
  onLoad: function (options) {
    /**
     * 尝试缓存数据 减少前后端交互所浪费的事件
     *  1. 每次请求数据 由于数据量非常大 导致接口请求时间超过1s
     *  2. 缓存数据 可以不用频繁的去请求数据(常规操作中,一般是由后台设置在响应头中的接口数据是否缓存的)
     * 
     * 前端存储 或者缓存
     * 1.存储的位置(本地存储)
     *      浏览器和微信小程序的本地存储
     *            浏览器 1. window.localStorage.setIte("key","value");
     *            微信小程序2. wx.setStorageSync("key","value")
     *      在浏览器中 存贮的数据必须要转换成自付出
     *      在小程序的本地存贮中 不需要进行任何的转换 存的数据类型是什么 取出来的就是什么
     * 2.存储的内容 
     *        {time: Date(),data:[...cates]}
     * 
     * 
     * 思路
     * 1.页面刚开始加载的时候判断一下本地存储中是否存在数据
     * 2.如果没有数据, 发送请求
     * 3.如果存在数据 判断一下旧数据有没有过期 如果没有过期则直接使用 已经过期 重新请求新的数据
     */
    let cates = wx.getStorageSync('cates')
    console.log("====>", cates)
    if (!cates) {
      this.getcategoryList()
    } else {
      if ((+new Date() - cates.time) > 100000) {
        this.getcategoryList()
      } else {
        this.cates=cates.data
        let leftData = this.cates.map(item => item.cat_name)
        // 获取右侧标题数据
        let rightData = this.cates.map(item => item.children)
        // 更新数据
        this.setData({
          leftData: leftData,
          rightData: rightData[0]
        })
      }
    }
    // this.getcategoryList()
    // 调用数据

  },
  // 获取数据方法名
  getcategoryList: async function () {
    // 获取数据
    let {
      data
    } = await wx.categoriesApi.categoryList()
    // 把数据赋值进来
    this.cates = data.message
    wx.setStorageSync('cates', {
      time: +new Date(),
      data: this.cates
    })
    // 获取左侧数据
    let leftData = this.cates.map(item => item.cat_name)
    // 获取右侧标题数据
    let rightData = this.cates.map(item => item.children)
    // 更新数据
    this.setData({
      leftData: leftData,
      rightData: rightData[0]
    })
  },
  // 点击事件
  categoryIndex(e) {
    console.log(e);
    // 获取下标
    let indexs = e.currentTarget.dataset.index;
    // 获取右侧数据
    let rightData = this.cates.map(item => item.children)
    // 更新数据
    this.setData({
      rightData: rightData[indexs],
      cateIndex: indexs,
      scrollTop: 0,
    })
  }
})